<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
    <th:block th:include="include :: header('预授信统计图表组合')"/>

    <style>
        .statics-label {
            font: 16px Helvetica Neue, Helvetica, PingFang SC, Tahoma, Arial, sans-serif;
        }

        .statics-label-div {
            text-align: center;
        }

        .ibox-container {
            padding: 2px;
        }

        .ibox-content-footer {
            padding: 10px 0 0 15px;
        }
    </style>

</head>
<body class="gray-bg">
<div class="wrapper wrapper-content animated fadeInRight">
    <form class="form-horizontal" id="form-starlevel-edit">
        <p style="margin-bottom: 5px; color: red">数据生成时间：[[${generationTime}]]</p>
        <!--header 数据-->
        <!--客户经理-->
        <!--个人预授信额度情况-->
        <div class="row" th:if="${type}=='1'">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: #ff5900; text-align: center">个人预授信额度情况</h3>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">预授信总额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-navy">
                                    [[${priorCreditLimit.priorCreditStatistics.priorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">个人类额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-info">
                                    [[${priorCreditLimit.priorCreditStatistics.anthropoidsLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">商户类额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditLimit.priorCreditStatistics.merchantLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">本月新增</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-success">
                                    [[${priorCreditLimit.priorCreditStatistics.thisMouthPriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">上月新增</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditLimit.priorCreditStatistics.lastMouthPriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">较上月</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditLimit.priorCreditStatistics.comparePriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--个人预授信户数情况-->
        <div class="row" th:if="${type}=='1'">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">个人预授信户数情况</h3>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">预授信总户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-navy">
                                    [[${priorCreditNum.priorCreditNumStatistics.priorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">个人户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-info">
                                    [[${priorCreditNum.priorCreditNumStatistics.anthropoidsNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">商户户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditNum.priorCreditNumStatistics.merchantNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">本月新增户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-success">
                                    [[${priorCreditNum.priorCreditNumStatistics.thisMouthPriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">上月新增户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditNum.priorCreditNumStatistics.lastMouthPriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">较上月</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditNum.priorCreditNumStatistics.comparePriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!--全行预授信额度情况-->
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">全行预授信额度情况</h3>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">预授信总额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-navy">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.priorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">个人类额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-info">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.anthropoidsLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">商户类额度</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.merchantLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">本月新增</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-success">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.thisMouthPriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">上月新增</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.lastMouthPriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">较上月</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllLimit.allPriorCreditLimit.comparePriorCreditLimit}]]&nbsp;&nbsp;万元
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--近一年额度趋势图-->
        <div class="row">
            <div class="col-sm-12 ibox-container">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>近一年额度趋势图</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="echarts" id="recent-one-year-limit-chart"></div>
                    </div>
                </div>
            </div>
        </div>

        <!--全行预授信户数情况-->
        <div class="row">
            <div class="col-sm-12 search-collapse">
                <h3 style="margin-bottom: 5px; color: red; text-align: center">全行预授信户数情况</h3>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">预授信总户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-navy">
                                    [[${priorCreditAllNum.allPriorCreditNum.priorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">个人户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-info">
                                    [[${priorCreditAllNum.allPriorCreditNum.anthropoidsNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">商户户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllNum.allPriorCreditNum.merchantNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">本月新增户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-success">
                                    [[${priorCreditAllNum.allPriorCreditNum.thisMouthPriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">上月新增户数</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllNum.allPriorCreditNum.lastMouthPriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-sm-2 ibox-container">
                <div class="ibox">
                    <div class="ibox-content">
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <label class="statics-label">较上月</label>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-sm-12 statics-label-div">
                                <h2 class="text-danger">
                                    [[${priorCreditAllNum.allPriorCreditNum.comparePriorCreditNum}]]&nbsp;&nbsp;户
                                </h2>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!--近一年户数趋势图-->
        <div class="row">
            <div class="col-sm-12 ibox-container">
                <div class="ibox float-e-margins">
                    <div class="ibox-title">
                        <h5>近一年户数趋势图</h5>
                    </div>
                    <div class="ibox-content">
                        <div class="echarts" id="recent-one-year-num-chart"></div>
                    </div>
                </div>
            </div>
        </div>
    </form>
</div>

<th:block th:include="include :: footer"/>
<th:block th:include="include :: echarts-js"/>
<script type="text/javascript">
    var prefix = ctx + "merchant/priorChart";

    $(function () {
        var recentOneYearLimitChart = echarts.init(document.getElementById("recent-one-year-limit-chart"), 'light');
        var recentOneYearNumChart = echarts.init(document.getElementById("recent-one-year-num-chart"), 'light');

        //近一年额度趋势图
        $.ajax({
            url: prefix + "/getLimitLineChart",
            type: 'post',
            data: {},
            success: function (res) {
                var recentOneYearLimitOption = res;
                //近一年额度趋势图
                recentOneYearLimitChart.setOption(recentOneYearLimitOption);
                window.onresize = recentOneYearLimitChart.resize;
            }
        });

        //近一年户数趋势图
        $.ajax({
            url: prefix + "/getNumLineChart",
            type: 'post',
            data: {},
            success: function (res) {
                var recentOneYearNumOption = res;
                //近一年户数趋势图
                recentOneYearNumChart.setOption(recentOneYearNumOption);
                window.onresize = recentOneYearNumChart.resize;
            }
        });

    })
</script>
</body>
</html>